<template>
  <div>
    <group>
      <datetime title="开始日期" v-model="beginTime" end-date="" format="YYYY-MM-DD"></datetime>
      <datetime title="结束日期" v-model="endTime" format="YYYY-MM-DD"></datetime>
      <agent-button @btnClick="searchClick">查询</agent-button>
    </group>
    <table-view :titles="titles" :dataSource="lists" @next="changePageClick" @previous="fetch" :maxPage="maxPage"></table-view>
  </div>
</template>
<script>
import { Datetime, Group, dateFormat } from "vux";
import TableView from "../../../components/common/TableView.vue";
import AgentButton from "../../../components/common/AgentButton.vue";
export default {
  data() {
    return {
      titles: [
        { key: "user_name", value: "代理名称" },
        { key: "money", value: "提现金额" },
        { key: "balance", value: "余额" },
        { key: "status", value: "状态" },
        { key: "create_time", value: "时间" }
      ],
      lists: [],
      maxPage: "",
      beginTime: dateFormat(new Date(), "YYYY-MM-DD"),
      endTime: dateFormat(new Date(), "YYYY-MM-DD")
    };
  },
  filters: {
    dateFormat
  },
  components: {
    Datetime,
    Group,
    TableView,
    AgentButton
  },
  methods: {
    fetch(page = 1) {
      this.apiService.user
        .withdrawalslist({
          starttime: this.beginTime,
          endtime: this.endTime,
          pagesize: 10,
          currentpage: page
        })
        .then(res => {
          this.maxPage = Math.ceil(res.data.total / 10);
          this.lists = res.data.withdrawalslist;
          this.lists.map(item => {
            item["create_time"] = dateFormat(
              new Date(item["create_time"] * 1000),
              "YYYY-MM-DD"
            );
            item.status = item.status == 1 ? "已完成" : "未完成";
          });
        });
    },
    searchClick() {
      this.fetch();
    },
    changePageClick(data) {
      this.fetch(data);
    }
  }
};
</script>

